//http://mint-ui.github.io/#!/zh-cn  官网首页
console.log('main.js文件')

//709制作项目首页的Header和Tabbar
//入口文件
import Vue from 'vue'

//7131.1 1.2导入路由的包  开始启用路由
import VueRouter  from 'vue-router'
Vue.use(VueRouter)

//window.localStorage.removeItem('car')
//每次刚进入网站,肯定会调用main.js  在刚调用的时候,先从本地存储中,把购物车的数据读出来,放到store中
var car = JSON.parse(localStorage.getItem('car') || '[]')
console.log(car)
//11.1注册vuex
import Vuex from 'vuex'
Vue.use(Vuex)
var store = new Vuex.Store({
	state: {  //this.$store.state.**
		car: car  //将购物车的商品的数据，用一个数组存储起来，在car数组中，存储一些商品对象，
		//我们暂时将商品对象设计成这样子
//		{id:id,count:count,price:price,selected:true}
	},
	mutations: {  //this.$store.commit('func')
	
		addToCar(state,goodsinfo){
			
			//点击加入购物车，把商品信息，保存到store中的car上
			//1.如果购物车中，之前就已经有这个对应的商品了，那么只要更新数据
			//2.如果没有，则直接把商品数据 push 到car中即可
			
			var flag = false  //假设购物车没有该商品
			state.car.some(item => {
				if(item.id === goodsinfo.id){
					item.count += parseInt(goodsinfo.count)
					flag = true
					return true
				}
			})
			//如果最终循环完毕，得到的flag还是false ，说明购物车一开始没有该方法
			if(!flag){
				state.car.push(goodsinfo)
			}
			console.log('state.car',state.car)
//			当更新car之后,把car数组存储到本地的localStorage中
			localStorage.setItem('car',JSON.stringify(state.car))
		},
		updateGoodsInfo(state, goodsinfo){
			//修改购物车商品数量
			//分析
			state.car.some(item => {
				if(item.id == goodsinfo.id){
					item.count = parseInt(goodsinfo.count)
					return true
				}
				
			})
//			当修改完商品的数量值,把最新的购物车数据,保存到本地存储中
			localStorage.setItem('car',JSON.stringify(state.car))
		},
		removeFormCar(state,id){
			//根据id从store中的购物车中删除对应的那条数据
			state.car.some((item,i) => {
				if(item.id == id){
					state.car.splice(i,1)
					return true
				}
			})
			//将删除完毕后，最新的购物车数据，同步到本地的
			localStorage.setItem('car',JSON.stringify(state.car))
		},
		updateGoodsSelected(state,info){
			state.car.some(item => {
				if(item.id == info.id){
					item.selected = info.selected
				}
			})
			console.log(state.car)
			//将，最新的开关数据，同步到本地的
			localStorage.setItem('car',JSON.stringify(state.car))
		}
	},
	getters: {  //this.$store.getters.***
		getAllCount(state){
			var c = 0;
			state.car.forEach(item => {
				c += item.count
			})
			return c
		},
		getGoodsCount(state){
			var o = {}
			state.car.forEach(item => {
				o[item.id] = item.count
			})
			console.log('o',o)
			return o
		},
		getGoodsSelected(state){
			var o = {}
			state.car.forEach(item => {
				o[item.id] = item.selected
			})
			return o
		},
		getGoodsCountAndAmount(state){
			var o = {
				count:0,amount:0
			}
			state.car.forEach(item => {
				if(item.selected){
					o.count += parseInt(item.count)
					o.amount += parseInt(item.price) * parseInt(item.count)
				}
			})
			return o
		}
	}
})



//13改造新闻列表中的时间格式化
//定义全局过滤器
//cnpm i moment -S
import moment from 'moment'
Vue.filter('dateFormat',function(dataStr,pattern="YYYY-MM-DD HH:MM:SS"){
	return moment(dataStr).format(pattern)//得到给定的时间
})



//导入MUI里面的样式
import './lib/mui/css/mui.css'
import './lib/mui/css/icons-extra.css'

//按需导入Mint-ui中的组件   //7-15完成首页轮播图的样式
/*
import {Header,Swipe,SwipeItem,Button,lazyload} from 'mint-ui'
//import {Header,Swipe,SwipeItem,Button} from 'mint-ui'
Vue.component(Header.name,Header)
Vue.component(Swipe.name,Swipe)
Vue.component(SwipeItem.name,SwipeItem)
Vue.component(Button.name,Button)
Vue.use(lazyload) 
*/
//9-7要实现懒加载,必须全部导入,不能按需导入
import MintUI from 'mint-ui'
Vue.use(MintUI)  
import 'mint-ui/lib/style.css'


//import router from './router.js'

//7-16完成首页中轮播图数据的加载
//1.cnpm i vue-resource -S
//2.导入vue-resource
import VueResource from 'vue-resource'
//3.安装vue-resource
Vue.use(VueResource)

/*
//9-10安装图片预览插件 导入preview
import VuePreview from 'vue-preview'
Vue.use(VuePreview)
*/
//Vue.http.options.root = 'http://vue.studyit.io'; //全局配置，设置请求的根路径  这个是之前的地址
Vue.http.options.root = 'http://47.89.21.179:8080'; //全局配置，设置请求的根路径

//9.1提交评论信息，实现服务器的双向绑定  
//全局设置post时候表单数据格式的组织形式  application/x-www-form-urlencoded
Vue.http.options.emulateJSON = true;

//http://47.89.21.179:8080/api/getmenus

//710将本地项目托管到码云中
//1.建立忽略文件  .gitignore  
//node_modules
//.idea
//.git
//.vscode
//2.创建readme.md
//3.复制开元协议
//4.格式化git  git init
//  git status  展示了所有文件的状态
// git add . 将所有的文件都放到区域里面去
// git commit -m "init my project"   提交到本地的git仓库
//git push
//5.https://gitee.com/ 打开码云官网  进入 注册登录
//  6.配公钥进入这里  G:\Git\usr\lib\ssh
//              ssh-keygen -t rsa -C "281793598@qq.com"
//  7.公钥弄完创建项目
//    git config --global user.name "sjr"  全局配置,方便将来的上传代码
//    git config --global user.email "281793598@qq.com"
//    建立远程连接
//    git remote add origin https://gitee.com/sjrwyu/01vue-webpack-cms.git
//git remote add origin https://gitee.com/sjrwyu/webpackdemo1.git 后面的项目的

//    将项目推上码云
//     git push -u origin master
//    有窗口需要验证  用户名 sjrwyu    密码 sjrwyu2018

//713.1.3导入自己的router模块
import router from './router.js'




//712完成底部导航栏目的图标
//713完成Tabbar路由链接的改造和路由高亮
//导入app组件
import app from './App.vue'

var vm = new Vue({
	el:"#app",
	render:c => c(app),
	router,  //713.1.4
	store //挂载store状态管理对象
})


//8.10改造新闻资讯的路由链接
//8-11绘制新闻资讯列表页面布局
//8-12获取新闻资讯列表并渲染页面


